<template>
  <div class="business-info-main">
    <div class="business-info-main-title">
      <h3>开发配置</h3>
    </div>
    <div class="business-info-main-table">
      <!--顶部标题-->
      <div class="business-info-main-table-title">
        <Row>
          <i-col span="15" class="cTitle rmCtitleBorder">
            <Row class="boderBottom">
              <i-col span="24" class="cTitle rmBorder mincTitle">基础配置</i-col>
            </Row>
            <Row>
              <i-col span="3" class="cTitle mincTitle">应用名称</i-col>
              <i-col span="3" class="cTitle mincTitle">APPID</i-col>
              <i-col span="3" class="cTitle mincTitle">templateId</i-col>
              <i-col span="3" class="cTitle mincTitle">支付宝网关</i-col>
              <i-col span="3" class="cTitle mincTitle">授权回调地址</i-col>
              <i-col span="3" class="cTitle mincTitle">城市编码</i-col>
              <i-col span="3" class="cTitle mincTitle">卡类型</i-col>
              <i-col span="3" class="cTitle mincTitle">bizType</i-col>
            </Row>
          </i-col>
          <i-col span="9" class="cTitle rmCtitleBorder">
            <Row class="boderBottom">
              <i-col span="24" class="cTitle rmBorder mincTitle">公钥/密钥</i-col>
            </Row>
            <Row>
              <i-col span="8" class="cTitle mincTitle">应用公钥1</i-col>
              <i-col span="8" class="cTitle mincTitle">应用私钥1</i-col>
              <i-col span="8" class="cTitle rmBorder mincTitle rmCtitleBorder">支付宝公钥1</i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <!--内容-->
      <div class="business-info-main-table-body">
        <Row>
          <i-col span="15" class="cBody rmCbodyBorder">
            <Row>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.name">{{formItem.name}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">sence</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.sence">{{formItem.sence}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.appId">{{formItem.appId}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">subSence</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.subSence">{{formItem.subSence}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.templateId">{{formItem.templateId}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">开卡验证</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.openCardVerifySource">{{formItem.openCardVerifySource}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.gateWay">{{formItem.gateWay}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">开卡成功</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.openCardSuccessSource">{{formItem.openCardSuccessSource}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.authReturnUrl">{{formItem.authReturnUrl}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">用卡乘车</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.useCardSource">{{formItem.useCardSource}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.cityCode">{{formItem.cityCode}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title"></div>
                    <div class="cBody minNtitleCbody rmCbodyBorder"></div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.cardType">{{formItem.cardType}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title"></div>
                    <div class="cBody minNtitleCbody rmCbodyBorder"></div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="3" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.bizType">{{formItem.bizType}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title"></div>
                    <div class="cBody minNtitleCbody rmCbodyBorder"></div>
                  </i-col>
                </Row>
              </i-col>
            </Row>
          </i-col>
          <i-col span="9" class="cBody rmCbodyBorder">
            <Row>
              <i-col span="8" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.appPublicKeyRsa1">{{formItem.appPublicKeyRsa1}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">应用公钥2</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.appPublicKeyRsa2">{{formItem.appPublicKeyRsa2}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="8" class="cBody">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.appPrivateKeyRsa1">{{formItem.appPrivateKeyRsa1}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">应用私钥2</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.appPrivateKeyRsa2">{{formItem.appPrivateKeyRsa2}}</div>
                  </i-col>
                </Row>
              </i-col>
              <i-col span="8" class="cBody rmCbodyBorder">
                <Row>
                  <i-col span="24" class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.alipayPublicKeyRsa1">{{formItem.alipayPublicKeyRsa1}}</i-col>
                </Row>
                <Row>
                  <i-col span="24" class="cBody minCbody rmCbodyBorder">
                    <div class="cBody-title">支付宝公钥2</div>
                    <div class="cBody minNtitleCbody rmCbodyBorder" :title="formItem.alipayPublicKeyRsa2">{{formItem.alipayPublicKeyRsa2}}</div>
                  </i-col>
                </Row>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  export default {
    data () {
      return {
        loginId: JSON.parse(sessionStorage.getItem('loginId')),
        formItem: {
          userInfos: [],
          name: '',
          appId: '',
          templateId: '',
          gateWay: '',
          authReturnUrl: '',
          cityCode: '',
          cardType: '',
          bizType: '',
          sence: '',
          subSence: '',
          openCardVerifySource: '',
          openCardSuccessSource: '',
          useCardSource: '',
          appPublicKeyRsa1: '',
          appPublicKeyRsa2: '',
          appPrivateKeyRsa1: '',
          appPrivateKeyRsa2: '',
          alipayPublicKeyRsa1: '',
          alipayPublicKeyRsa2: ''
        }
      }
    },
    created () {
      /* 第二步：获取用户历史配置信息 */
      if (JSON.parse(sessionStorage.getItem('formItem'))) {
        this.formItem = JSON.parse(sessionStorage.getItem('formItem'))
      } else {
        this.getInitInfor()
      }
    },
    methods: {
      // 获取领卡退卡数据
      getInitInfor () {
        let url = this.api.init.getInitInfor
        let params = {
          userId: this.loginId
        }
        this.$axios.get(url, {params: params}).then((res) => {
          if (res.data.msg.code === '20000') {
            if (res.data.data) {
              let initData = res.data.data
              sessionStorage.setItem('dataId', JSON.stringify(initData.id))
              sessionStorage.setItem('initData', JSON.stringify(initData))
              this.formItem = {
                userInfos: initData.userInfos.split(','),
                name: initData.name,
                appId: initData.appId,
                templateId: initData.templateId,
                gateWay: initData.gateWay,
                authReturnUrl: initData.authReturnUrl,
                cityCode: initData.alipayClientSubInfo.cityCode,
                cardType: initData.alipayClientSubInfo.cardType,
                bizType: initData.alipayClientSubInfo.bizType,
                sence: initData.alipayClientSubInfo.sence,
                subSence: initData.alipayClientSubInfo.subSence,
                openCardVerifySource: initData.alipayClientSubInfo.openCardVerifySource,
                openCardSuccessSource: initData.alipayClientSubInfo.openCardSuccessSource,
                useCardSource: initData.alipayClientSubInfo.useCardSource,
                appPublicKeyRsa1: initData.appPublicKeyRsa1,
                appPublicKeyRsa2: initData.appPublicKeyRsa2,
                appPrivateKeyRsa1: initData.appPrivateKeyRsa1,
                appPrivateKeyRsa2: initData.appPrivateKeyRsa2,
                alipayPublicKeyRsa1: initData.alipayPublicKeyRsa1,
                alipayPublicKeyRsa2: initData.alipayPublicKeyRsa2
              }
              sessionStorage.setItem('formItem', JSON.stringify(this.formItem))
            } else {
              this.$Modal.confirm({
                title: '提示',
                content: '未配置前置条件信息，请前往前置条件配置相关信息',
                onOk: () => {
                  this.$router.push('/initialization')
                },
                onCancel: () => {
                  this.$Message.info('未配置前置条件信息，无法获取配置相关信息')
                }
              })
            }
          } else {
            this.$Message.error({content: res.data.msg.message, duration: 5})
          }
        }).catch((err) => {
          if (err) throw err
          this.$Message.error({content: '网络异常', duration: 5})
        })
      }
    }
  }
</script>
